<template>
  <view class="login-container">
    <!-- 半透明遮罩层 -->
    <view class="overlay"></view>
    
    <!-- 背景图 -->
    <view class="background-wrapper">
      <image src="/static/login.png" mode="aspectFill" class="background-image"></image>
    </view>
    
    <!-- 表单卡片 -->
    <view class="form-card">
      <!-- 医院Logo -->
      <view class="logo-container">
        <image src="/static/hospitalLog.png" class="hospital-logo"></image>
      </view>
      
      <!-- 标题 -->
      <view class="header">
        <text class="title">医护回访系统</text>
        <text class="subtitle">欢迎登录</text>
      </view>
      
      <!-- 输入框组 - 使用新的FormInputLogin组件 -->
      <view class="input-group">
        <FormInputLogin 
          v-model="form.patientUserName" 
          placeholder="请输入用户名/身份证号" 
          type="text" 
          :required="true" 
        />
        
        <FormInputLogin 
          v-model="form.password" 
          placeholder="请输入密码" 
          type="password" 
          :required="true" 
        />
      </view>
      
      <!-- 登录按钮 -->
      <view class="action-buttons">
        <button class="login-btn" @click="login">登 录</button>
        <view class="register-section">
          <text class="register-link" @click="goRegister">立即注册</text>
          <text class="register-link" @click="goResetKey">重置密码</text>
        </view>
      </view>
      
      <!-- 底部信息 -->
      <!-- 
      <view class="footer">
          <text class="hospital-info">山东大学齐鲁医院</text>
          <text class="contact">服务热线: 0531-82168888</text>
      </view>
      -->
    </view>
  </view>
</template>

<script>
// 引入新的专用登录输入框组件
import FormInputLogin from '../../components/FormInputLogin.vue';
import config from '../../config.js'; 

export default {
  components: {
    FormInputLogin
  },
  data() {
    return {
      form: {
        hospitalNumber: "",
        patientUserName: '',
        password: '',
        createTime: new Date().toISOString(),
        updateTime: new Date().toISOString()
      }
    };
  },
  methods: {
    async login() {
      if (!this.form.patientUserName || !this.form.password) {
        uni.showToast({
          title: '请输入用户名和密码',
          icon: 'none'
        });
        return;
      }
      try {
        const response = await uni.request({
          url: `${config.baseUrl}/patient/login`,
          method: 'POST',
          data: this.form,
          header: {
            'content-type': 'application/json'
          }
        });
        if (response.statusCode === 200 && response.data && response.data.code === 1) {
			let data = response.data.data
			console.log(data)
          uni.setStorageSync('token', data.token);
		  uni.setStorageSync('username',data.username)
          uni.setStorageSync('hospitalNumber', data.hospitalNumber);
		  uni.setStorageSync('idCard',data.idCard)
		  console.log("idCard",uni.getStorageSync("idCard"));
		  console.log(data.authority)
		  uni.setStorageSync('authority', data.authority);
		  uni.setStorageSync('address',data.address)
		  uni.setStorageSync('age',data.age)
		  uni.setStorageSync('detailAddress',data.detailAddress)
		  uni.setStorageSync('disease',data.disease)
		  uni.setStorageSync('gender',data.gender)
		  uni.setStorageSync('phone',data.phone)
		  uni.setStorageSync('surgery_date',data.surgery_date)
		  uni.setStorageSync("hasRegisteredInfo",data.hasRegisteredInfo)
		  await this.goQA();
		  if(data.hasRegisteredInfo === 1) {
			  uni.switchTab({
				  url: '/pages/main/main'
			   });
		   } else {
			   uni.reLaunch({
			   	url:"/pages/changePersonalInfo/changePersonalInfo"
			   })
		   }
        } else {
          throw new Error(response.data?.msg || '登录失败');
        }
      } catch (error) {
        uni.showToast({
          title: error.message || '登录失败，请重试',
          icon: 'none'
        });
      }
    },
	async goQA() {
      const hospitalNumber = uni.getStorageSync('hospitalNumber');
      if (!hospitalNumber) {
        uni.showToast({
          title: '未获取到住院号，请重新登录',
          icon: 'none'
        });
        return;
      }
      try {
        const res = await uni.request({
          url: `${config.baseUrl}/patient/checkInfoWrite?hospitalNumber=${encodeURIComponent(hospitalNumber)}`,
          method: 'GET',
          header: {
            'Content-Type': 'application/json',
            'Authorization': uni.getStorageSync('token') || ''
          }
        });
        if (res.statusCode === 200 && res.data && res.data.code === 1) {
          uni.setStorageSync('access', '1');
        } else {
          uni.setStorageSync('access', '0');
        }
      } catch (error) {
        uni.setStorageSync('access', '0');
      }
    },
    goRegister() {
      uni.navigateTo({
        url: '/pages/register/register'
      });
    },
    goResetKey() {
      uni.navigateTo({
        url: '/pages/resetKey/resetKey'
      });
    }
  }
};
</script>

<style lang="scss">
/* 整体容器优化 */
.login-container {
  position: relative;
  width: 100%;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  
  /* 半透明遮罩层 */
  .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(0, 90, 158, 0.7) 0%, rgba(0, 60, 120, 0.8) 100%);
    z-index: 1;
  }
  
  /* 背景图优化 */
  .background-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    
    .background-image {
      width: 100%;
      height: 100%;
      object-fit: cover;
      filter: blur(4px);
    }
  }
  
  /* 表单卡片优化 */
  .form-card {
    position: relative;
    z-index: 2;
    width: 85%;
    max-width: 650rpx;
    padding: 50rpx 40rpx;
    background: rgba(255, 255, 255, 0.98);
    border-radius: 24rpx;
    box-shadow: 0 10rpx 50rpx rgba(0, 60, 120, 0.3);
    display: flex;
    flex-direction: column;
    
    /* Logo样式 */
    .logo-container {
      display: flex;
      justify-content: center;
      margin-bottom: 30rpx;
      
      .hospital-logo {
        width: 140rpx;
        height: 140rpx;
        border-radius: 50%;
        border: 2rpx solid #e0f0ff;
        background: white;
        box-shadow: 0 5rpx 15rpx rgba(0, 90, 158, 0.2);
      }
    }
    
    /* 标题样式 */
    .header {
      text-align: center;
      margin-bottom: 60rpx;
      
      .title {
        display: block;
        font-size: 40rpx;
        font-weight: bold;
        color: #005a9e;
        margin-bottom: 16rpx;
        letter-spacing: 1rpx;
      }
      
      .subtitle {
        display: block;
        font-size: 34rpx;
        color: #666;
        letter-spacing: 2rpx;
      }
    }
    
    /* 输入框组 */
    .input-group {
      margin-bottom: 20rpx;
    }
    
    /* 按钮区域 */
    .action-buttons {
      margin-top: 70rpx;
      
      .login-btn {
        background: linear-gradient(to right, #0081ff, #005a9e);
        color: white;
        height: 90rpx;
        border-radius: 45rpx;
        font-size: 34rpx;
        font-weight: 500;
        box-shadow: 0 8rpx 20rpx rgba(0, 90, 158, 0.3);
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.3s;
        
        &:active {
          transform: scale(0.98);
          opacity: 0.9;
        }
      }
      
      .register-section {
        display: flex;
        justify-content: center;
        margin-top: 40rpx;
        
        .register-link {
          font-size: 28rpx;
          color: #0081ff;
          margin: 0 12rpx;
          font-weight: 500;
        }
      }
    }
    
    /* 底部信息 */
    .footer {
      margin-top: 60rpx;
      text-align: center;
      border-top: 1rpx solid #eee;
      padding-top: 30rpx;
      
      .hospital-info {
        display: block;
        font-size: 28rpx;
        color: #005a9e;
        font-weight: bold;
      }
      
      .contact {
        display: block;
        font-size: 24rpx;
        color: #888;
        margin-top: 15rpx;
      }
    }
  }
}
</style>